<template>
	<view>
		<view class="tab">
			<view class="tab-item" :class="tabIndex==0?'tab-itemd':''">全部</view>
			<!-- <view class="tab-item" :class="tabIndex==item.id?'tab-itemd':''" @click="checktab(item.id)" v-for="(item,index) in categoryList" :key="index">私密整形</view> -->
		</view>
		<view class="list">
			<view class="list-item" v-for="(item,index) in list" :key="index" @tap="jump(item.id)">
				<image :src="item.image" style="width: 100%;height: 100%;border-radius: 20rpx;"></image>
			</view>
		</view>
	</view>
</template>

<script>
	import {postCagegory,postIndex} from '@/api/expert.js'
	import share from '@/shopro/share';
	export default{
		data(){
			return{
				tabIndex:0,
				category_id:0,
				page:1,
				categoryList:[],
				list:[]
			}
		},
		onShow() {
			this.getCategory()
			this.getData(0)
		},
		methods:{
			//分类切换
			checktab(e){
				this.tabIndex=e
				this.getData(0)
			},
			// 路由跳转
			jump(e) {
				uni.navigateTo({
					url:'/pages/user/export-detail?id='+e
				})
			},
			//专家分类
			getCategory(){
				postCagegory().then(res=>{
					this.categoryList=res.data
				})
			},
			//专家列表
			getData(type){
				var data={
					category_id:this.category_id,
					page:this.page
				}
				postIndex(data).then(res=>{
					share.setShareInfo({
						params: {
							page: 5
						}
					});
					if(res.data.length>0){
						if(type==1){
							res.data.forEach((item,index)=>{
								this.list.push(item)
							})
							this.page++
						}else{
							this.list=res.data
						}
					}else{
						uni.showToast({
							title:type==0?'暂无数据':'已经到底了',
							icon:'none',
							duration:1000
						})
					}
				})
			}
		}
	}
</script>

<style scoped>
	.tab{
		padding: 20rpx;
		display: flex;
		align-items: center;
		background-color: white;
		
	}
	.tab-item{
		font-size: 28rpx;
		color: #979797;
		margin-right: 50rpx;
		padding-bottom: 20rpx;
	}
	.tab-itemd{
		color: #b6075c;
	}
	.list{
		padding: 20rpx 22rpx 14rpx 23rpx;
	}
	.list-item{
		width: 705rpx;
		height: 376rpx;
		border-radius: 20rpx;
		margin-bottom: 34rpx;
	}
</style>